<template>
	<!-- 陆亿备份版本 -->
	<view>
		<!-- 头部搜索框 -->
		<view class="topSearch">
			<zy-forms :model="model" :rules="rules" ref="ruleForm">
				<zy-form-item :label="$t('homepage.WarehouseManage.internalTrackingNum') + $t('public.colon')"
					labelWidth='160' required>
					<zy-input v-model="model.nbdocnum" @confirm="nbdocnumConfirm" sufSlot>
						<i class="iconfont icon-saoyisao" @click="scanHandle('nbdocnum')" v-if="!model.nbdocnum"></i>
						<i class="iconfont icon-qingchu" @click="model.nbdocnum='',model.barCode=''" v-else></i>
					</zy-input>
				</zy-form-item>
				<zy-form-item :label="$t('homepage.WarehouseManage.rollNo') + $t('public.colon')" labelWidth='160'
					:border="false">
					<zy-input v-model="model.barCode" @confirm="barCodeConfirm" sufSlot>
						<i class="iconfont icon-saoyisao" @click="scanHandle('barCode')" v-if="!model.barCode"></i>
						<i class="iconfont icon-qingchu" @click="model.barCode=''" v-else></i>
					</zy-input>
				</zy-form-item>
			</zy-forms>
		</view>
		<!-- 分段器 -->
		<zy-segmented :values="items" :current="current" styleType="button" @onClickItem="onClickItem" :fixed="false">
			<!-- 搜索无记录 -->
			<zy-empty v-if="current==0?dataList.length==0:list.length==0"></zy-empty>
			<!-- 明细列表 -->
			<zy-group v-for="(item,index) in current==0?dataList:list" :key="item.id" model="insideCard" title=""
				:btnList="current==0?btnList1:btnList2" :btnDisabled="current==0?item.disabled:false"
				@btnHandle="current==0?rightBtn(item, index):delBtn(item, index)" v-else>
				<zy-forms :model="item" border labelWidth="120">
					<zy-form-item :label="$t('homepage.WarehouseManage.rollNo') + $t('public.colon')"><text
							class="formText">{{item.batchNo || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.ProductionMonitor.materialNameTitle')"><text
							class="formText">{{item.materialName || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.ProductionMonitor.materialCodeTitle')"><text
							class="formText">{{item.materialCode || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.ProductionMonitor.materialSpecTitle')"><text
							class="formText">{{item.Spec || $t('public.null')}}</text>
					</zy-form-item>
					<zy-form-item :label="$t('homepage.ProductionMonitor.numTitle')"><text
							class="formText">{{item.num || $t('public.null')}}</text>
					</zy-form-item>
				</zy-forms>
			</zy-group>
			<!-- 底部按钮 -->
			<bottomBtn fixed :leftText="$t('public.reset')" :rightText="rightText" :leftDisabled="leftDisabled"
				:rightDisabled="current==0?rightDisabled:submitDisabled" @rightBtn="rightBtn" @leftBtn="resetBtn">
			</bottomBtn>
		</zy-segmented>
		<!-- 仓储位选择弹窗 -->
		<zy-popup ref="popup" type='dialog' :title="$t('homepage.WarehouseManage.SPselect')" @confirm="selectConfirm"
			:closeOnClickOverlay="false" @cancel="selectCancel">
			<zy-forms :rules="selectRules" :model="selectModel" labelWidth="80">
				<zy-form-item :label="$t('public.storage')" required>
					<zy-input v-model="selectModel.storage" :placeholder="$t('public.pleaseInput')+$t('public.storage')"
						@confirm="storageSearch" sufSlot>
						<i class="iconfont icon-saoyisao" @click="scanStorage"></i>
					</zy-input>
				</zy-form-item>
				<zy-form-item :label="$t('public.position')" required>
					<zy-input v-model="selectModel.position" @confirm="positionSearch"
						:placeholder="$t('public.pleaseInput')+$t('public.position')" sufSlot>
						<i class="iconfont icon-saoyisao" @click="scanPosition"></i>
					</zy-input>
				</zy-form-item>
			</zy-forms>
		</zy-popup>
		<!-- 提交二次确认 -->
		<zy-popup ref="confirmPopup" :title="$t('homepage.WarehouseManage.submitSure')" type="dialog"
			@confirm="submitConfirm">
			WarehouseManage.submitInfo')}}
		</zy-popup>
	</view>
</template>
<script>
	import {
		getStorehouseInByCode,
		positionGetEntityByCode,
		storageGetEntityByCode,
		inStorehouseIn
	} from "@/api/homepage.js"
	import scanData from '@/common/scan.js';
	export default {
		components: {},
		data() {
			return {
				//表单value
				model: {
					nbdocnum: '',
					barCode: ''
				},
				//表单校验
				rules: [{
					required: true,
					name: "nbdocnum",
					checkType: "notnull",
					checkRule: "",
					message: this.$t('homepage.WarehouseManage.inputNotice')
				}],
				items: [this.$t('homepage.WarehouseManage.detailedList'), this.$t(
					'homepage.WarehouseManage.inInventoryList')], //分段器名称
				current: 0, //分段器默认初始值
				// 明细清单表单按钮
				btnList1: [{
					text: this.$t('homepage.WarehouseManage.PSselect'),
					type: 'primary',
				}],
				// 待入库清单表单按钮
				btnList2: [{
					text: this.$t('public.del'),
					type: 'danger'
				}],
				dataList: [],
				list: [], // 待入库清单表单数据
				rightText: "", //底部右侧按钮名称
				leftDisabled: true, //底部左侧按钮禁用
				rightDisabled: true, //底部右侧按钮禁用,current==0
				submitDisabled: true, //底部右侧按钮禁用,current==1
				selectList: [], //已选择待入库清单
				// 仓储位选择弹窗表单
				selectModel: {
					position: '',
					storage: '',
				},
				storageId: "",
				positionId: "",
				selectRules: {
					position: {
						required: false,
						message: this.$t('public.pleaseInput') + this.$t('public.position'),
						trigger: 'blur'
					},
					storage: {
						required: true,
						message: this.$t('public.pleaseInput') + this.$t('public.storage'),
						trigger: 'blur'
					}
				},
			}
		},
		onLoad() {
			this.getscancodedate()
		},
		onUnload() {
			// 移除监听事件      
			uni.$off('scancodedate')
			uni.$off('scancodepopdate')
		},
		watch: {
			model: {
				handler(n, o) {
					if (n !== o) {
						// 监听默认"内部单号"查询,表单置空
						this.dataList = []
					}
				},
				immediate: true,
				deep: true
			},
			current: {
				handler(n, o) {
					// 根据分段器当前位置,判断底部按钮名称
					if (n == 0) {
						this.rightText = this.$t('homepage.WarehouseManage.PSselect')
					} else {
						this.rightText = this.$t('homepage.WarehouseManage.submit')
					}
				},
				immediate: true,
				deep: true
			},
			dataList: {
				handler(n, o) {
					//根据明细清单列表长度,判断底部左侧按钮是否禁用
					if (n.length > 0) {
						this.leftDisabled = false
					} else {
						this.leftDisabled = true
					}
					// 根据分段器当前位置,判断底部右侧按钮是否禁用
					if (n.findIndex(item => item.disabled === false) !== -1) {
						this.rightDisabled = false
					} else {
						this.rightDisabled = true
					}
				},
				immediate: true,
				deep: true
			},
			list: {
				handler(n, o) {
					//根据待入库清单列表长度,判断底部右按钮是否禁用
					if (n.length > 0) {
						this.submitDisabled = false
					} else {
						this.submitDisabled = true
					}
				},
				immediate: true,
				deep: true
			},
		},
		methods: {
			//主页获取箱号扫描事件
			getscancodedate() {
				// 移除监听“添加扫描”弹窗事件
				uni.$off('scancodepopdate')
				//PDA扫描主页指示单号
				var _this = this
				uni.$on('scancodedate', function(data) {
					_this.searchList(data.code)
				})
			},
			//“弹窗储位”获取扫描事件
			getscancodepopdate() {
				// 移除监听“指示单号”事件
				uni.$off('scancodedate')
				//PDA扫描“添加扫描”弹窗事件
				var _this = this
				uni.$on('scancodepopdate', function(data) {
					_this.selectModel.storage = data.code
					_this.storageSearch()
				})
			},
			// “内部单号”/“卷条码”二维码扫码事件
			scanHandle(field) {
				scanData.getScanData()
				uni.$once("barScan", (rel) => {
					if (field == "nbdocnum") {
						this.model.nbdocnum = rel
						this.searchList()
					} else if (field == "barCode") {
						if (!this.model.nbdocnum) {
							uni.showToast({
								title: this.$t('homepage.WarehouseManage.inputNoticedSearch'),
								icon: "none",
								duration: 3000
							})
						} else {
							this.model.barCode = rel
							this.searchList()
						}
					}
				})
			},
			// 搜索框回车事件
			nbdocnumConfirm(e) {
				this.model.nbdocnum = e
				this.searchList()
			},
			barCodeConfirm(e) {
				this.model.barCode = e
				this.searchList()
			},
			// 查询事件
			searchList(e) {
				// 红外扫描
				if (e) {
					if (!this.model.nbdocnum) {
						this.model.nbdocnum = e
					} else {
						this.model.barCode = e
					}
				}
				getStorehouseInByCode({
					nbdocnum: this.model.nbdocnum,
					barCode: this.model.barCode,
				}).then((res) => {
					if (res.code == 0) {
						if (this.model.barCode == "") {
							this.dataList = res.data.map(m => {
								return Object.assign(m, {
									disabled: true
								})
							})
						} else {
							this.dataList.forEach((item, index) => {
								if (item.id == res.data[0].id) {
									if (item.warehousePositionId && item.warehouseStorageId) {
										uni.showToast({
											title: this.$t(
												'homepage.WarehouseManage.rollCodeInstoraged'),
											icon: "none",
											duration: 3000
										})
									} else {
										this.dataList[index].disabled = false
									}
								}
							})
						}
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				})
			},
			// 分段器选项发生改变时触发
			onClickItem(e) {
				this.current = e
			},
			// 重置事件
			resetBtn() {
				uni.redirectTo({
					url: "/pages/HomePage/WarehouseManage/StorageManagement/Instorage/index"
				})
			},
			// 底部右侧按钮事件
			rightBtn(item) {
				// 明细清单状态下
				if (this.current == 0) {
					this.$refs.popup.open()
					this.getscancodepopdate()
					this.selectModel.storage = ''
					this.selectModel.position = ''
					this.selectList = []
					// 点击单个列表入仓储位
					if (item) {
						this.selectList.push(item)
					} else {
						// 列表中可入库的入仓储位
						this.dataList.forEach((item, index) => {
							if (!item.disabled) {
								this.selectList.push(item)

							}
						})
					}
				}
				// 待入库清单状态下
				else if (this.current == 1) {
					this.$refs.confirmPopup.open()
				}
			},
			// 删除事件
			delBtn(item) {
				this.dataList.forEach((m, n) => {
					if (item === m) {
						this.dataList[n].disabled = false
					}
				})
				this.selectList.forEach((p, q) => {
					if (item === p) {
						this.selectList.splice(q, 1);
					}
				})
				this.list = this.selectList
			},
			//仓位扫描事件
			scanPosition() {
				scanData.getScanData()
				uni.$once("barScan", (rel) => {
					this.selectModel.position = rel;
					this.positionSearch()
				})
			},
			//储位扫描事件
			scanStorage() {
				scanData.getScanData()
				uni.$once("barScan", (rel) => {
					this.selectModel.storage = rel;
					this.storageSearch()
				})
			},
			//仓位接口
			positionSearch() {
				positionGetEntityByCode({
					code: this.selectModel.position
				}).then((res) => {
					if (res.code == 0) {
						this.positionId = res.data.id
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
			//储位接口
			storageSearch() {
				storageGetEntityByCode({
					code: this.selectModel.storage
				}).then((res) => {
					if (res.code == 0) {
						this.selectModel.position = res.data.warehousePosition.code
						this.positionSearch()
						this.storageId = res.data.id
					} else {
						uni.showToast({
							title: res.message,
							icon: "none",
							duration: 3000
						})
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
			// 仓储位弹窗取消
			selectCancel() {
				let that = this
				that.getscancodedate()
			},
			// 仓储位弹窗提交
			selectConfirm() {
				let that = this
				that.getscancodedate()
				that.$refs.popup.close()
				that.selectList.forEach((item, index) => {
					if (!item.warehousePositionId && !item.warehouseStorageId) {
						that.list.push(item)
						that.list[index].warehousePositionId = that.positionId
						that.list[index].warehouseStorageId = that.storageId
					}
					that.dataList.forEach((m, n) => {
						if (item == m) {
							that.dataList[n].disabled = true
						}
					})
				})
			},
			// 提交二次确认弹窗确认事件
			submitConfirm() {
				this.list.forEach((item, index) => {
					this.$delete(item, 'disabled');
				})
				this.$refs.confirmPopup.close()
				inStorehouseIn({
					dataArray: JSON.stringify(this.list)
				}).then((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
					if (res.code == 0) {
						setTimeout(() => {
							this.resetBtn()
						}, 1000)
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: "none",
						duration: 3000
					})
				});
			},
		}
	}
</script>
<style lang="scss" scoped>
	.topSearch {
		background: #ffffff;
		padding: 0 30rpx;
		width: calc(100% - 60rpx);
	}

	.bottomBtn {
		background: #ffffff;
	}
</style>